<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>HTML5模拟牛顿力学 碰撞的小球在线演示</title>

<style> 
*{ padding: 0; margin: 0; font-family: sans-serif; }

body {
 background: #222;
}

canvas:active { 
    cursor: pointer;
    cursor: -webkit-grabbing;
} </style>

</head>

<body>

<div style="text-align:center">
	<div id="stage"></div>
</div>

<script> /**
* matter-0.5.0.min.js 0.5.0-alpha 0.5.0 2014-02-28
* http://brm.io/matter-js/
* License: MIT
*/

!function(){var a={},b={};!function(){var a=0,c=1;b.create=function(a){var c={id:b.nextId(),angle:0,position:{x:0,y:0},force:{x:0,y:0},torque:0,positionImpulse:{x:0,y:0},speed:0,angularSpeed:0,velocity:{x:0,y:0},angularVelocity:0,isStatic:!1,isSleeping:!1,motion:0,sleepThreshold:60,density:.001,restitution:0,friction:.1,frictionAir:.01,path:"L 0 0 L 40 0 L 40 40 L 0 40",fillStyle:a.isStatic?"#eeeeee":n.choose(["#556270","#4ECDC4","#C7F464","#FF6B6B","#C44D58"]),lineWidth:1.5,groupId:0,slop:.05},d=n.extend(c,a);return b.updateProperties(d),d},b.nextId=function(){return a++},b.nextGroupId=function(){return c++},b.updateProperties=function(a){a.vertices=a.vertices||x.fromPath(a.path),a.axes=a.axes||u.fromVertices(a.vertices),a.area=x.area(a.vertices),a.bounds=v.create(a.vertices),a.mass=a.mass||a.density*a.area,a.inverseMass=1/a.mass,a.inertia=a.inertia||x.inertia(a.vertices,a.mass),a.inverseInertia=1/a.inertia,a.positionPrev=a.positionPrev||{x:a.position.x,y:a.position.y},a.anglePrev=a.anglePrev||a.angle,a.strokeStyle=a.strokeStyle||n.shadeColor(a.fillStyle,-20),x.create(a.vertices,a);var b=x.centre(a.vertices);x.translate(a.vertices,a.position),x.translate(a.vertices,b,-1),x.rotate(a.vertices,a.angle,a.position),u.rotate(a.axes,a.angle),v.update(a.bounds,a.vertices,a.velocity),a.isStatic&&(a.restitution=0,a.friction=1,a.mass=a.inertia=a.density=1/0,a.inverseMass=a.inverseInertia=0,a.lineWidth=1),r.set(a,a.isSleeping)},b.resetForcesAll=function(a,b){for(var c=0;c<a.length;c++){var d=a[c];d.isStatic||d.isSleeping||(d.force.x=0,d.force.y=0,d.torque=0,d.force.y+=d.mass*b.y*.001,d.force.x+=d.mass*b.x*.001)}},b.updateAll=function(a,c,d,e){for(var f=0;f<a.length;f++){var g=a[f];g.isStatic||g.isSleeping||g.bounds.max.x<e.min.x||g.bounds.min.x>e.max.x||g.bounds.max.y<e.min.y||g.bounds.min.y>e.max.y||b.update(g,c,d)}},b.update=function(a,b,c){var d=b*b,e=1-a.frictionAir,f=a.position.x-a.positionPrev.x,g=a.position.y-a.positionPrev.y;a.velocity.x=f*e*c+a.force.x/a.mass*d,a.velocity.y=g*e*c+a.force.y/a.mass*d,a.positionPrev.x=a.position.x,a.positionPrev.y=a.position.y,a.position.x+=a.velocity.x,a.position.y+=a.velocity.y,a.angularVelocity=(a.angle-a.anglePrev)*e*c+a.torque/a.inertia*d,a.anglePrev=a.angle,a.angle+=a.angularVelocity,a.speed=w.magnitude(a.velocity),a.angularSpeed=Math.abs(a.angularVelocity),x.translate(a.vertices,a.velocity),x.rotate(a.vertices,a.angularVelocity,a.position),u.rotate(a.axes,a.angularVelocity),v.update(a.bounds,a.vertices,a.velocity)},b.applyForce=function(a,b,c){a.force.x+=c.x,a.force.y+=c.y;var d={x:b.x-a.position.x,y:b.y-a.position.y};a.torque+=(d.x*c.y-d.y*c.x)*a.inverseInertia},b.translate=function(a,b){a.positionPrev.x+=b.x,a.positionPrev.y+=b.y,a.position.x+=b.x,a.position.y+=b.y,x.translate(a.vertices,b),v.update(a.bounds,a.vertices,a.velocity)},b.rotate=function(a,b){a.anglePrev+=b,a.angle+=b,x.rotate(a.vertices,b,a.position),u.rotate(a.axes,b),v.update(a.bounds,a.vertices,a.velocity)}}();var c={};!function(){c.create=function(a){return n.extend({bodies:[],constraints:[],composites:[]},a)},c.add=function(a,b){return a.bodies&&b.bodies&&(a.bodies=a.bodies.concat(b.bodies)),a.constraints&&b.constraints&&(a.constraints=a.constraints.concat(b.constraints)),a.composites&&b.composites&&(a.composites=a.composites.concat(b.composites)),a},c.addBody=function(a,b){return a.bodies=a.bodies||[],a.bodies.push(b),a},c.addConstraint=function(a,b){return a.constraints=a.constraints||[],a.constraints.push(b),a}}();var d={};!function(){d.create=function(a){var b={gravity:{x:0,y:1},bodies:[],constraints:[],bounds:{min:{x:0,y:0},max:{x:800,y:600}}};return n.extend(b,a)},d.clear=function(a,b){a.bodies=b?a.bodies.filter(function(a){return a.isStatic}):[],a.constraints=[]}}();var e={};!function(){e.create=function(a){return{id:e.id(a),vertex:a,normalImpulse:0,tangentImpulse:0}},e.id=function(a){return a.body.id+"_"+a.index}}();var f={};!function(){f.collisions=function(a,b){for(var c=[],d=0;d<a.length;d++){var e=a[d][0],f=a[d][1];if(!(e.groupId&&f.groupId&&e.groupId===f.groupId||(e.isStatic||e.isSleeping)&&(f.isStatic||f.isSleeping)||(b.midphaseTests+=1,!v.overlaps(e.bounds,f.bounds)))){var g=k.collides(e,f);b.narrowphaseTests+=1,g.collided&&(c.push(g),b.narrowDetections+=1)}}return c},f.bruteForce=function(a,b){for(var c=[],d=0;d<a.length;d++)for(var e=d+1;e<a.length;e++){var f=a[d],g=a[e];if(!(f.groupId&&g.groupId&&f.groupId===g.groupId||(f.isStatic||f.isSleeping)&&(g.isStatic||g.isSleeping)||(b.midphaseTests+=1,!v.overlaps(f.bounds,g.bounds)))){var h=k.collides(f,g);b.narrowphaseTests+=1,h.collided&&(c.push(h),b.narrowDetections+=1)}}return c}}();var g={};!function(){g.create=function(a,b){return{buckets:{},pairs:{},pairsList:[],bucketWidth:a||48,bucketHeight:b||48}},g.update=function(c,g,i,k){var l,m,n,o,p,q=i.world,r=c.buckets,s=i.metrics,t=!1;for(s.broadphaseTests=0,l=0;l<g.length;l++){var u=g[l];if(!u.isSleeping&&!(u.bounds.max.x<0||u.bounds.min.x>q.bounds.width||u.bounds.max.y<0||u.bounds.min.y>q.bounds.height)){var v=b(c,u);if(!u.region||v.id!==u.region.id||k){s.broadphaseTests+=1,(!u.region||k)&&(u.region=v);var w=a(v,u.region);for(m=w.startCol;m<=w.endCol;m++)for(n=w.startRow;n<=w.endRow;n++){p=d(m,n),o=r[p];var x=m>=v.startCol&&m<=v.endCol&&n>=v.startRow&&n<=v.endRow,y=m>=u.region.startCol&&m<=u.region.endCol&&n>=u.region.startRow&&n<=u.region.endRow;!x&&y&&y&&o&&h(c,o,u),(u.region===v||x&&!y||k)&&(o||(o=e(r,p)),f(c,o,u))}u.region=v,t=!0}}}t&&(c.pairsList=j(c))},g.clear=function(a){a.buckets={},a.pairs={},a.pairsList=[]};var a=function(a,b){var d=Math.min(a.startCol,b.startCol),e=Math.max(a.endCol,b.endCol),f=Math.min(a.startRow,b.startRow),g=Math.max(a.endRow,b.endRow);return c(d,e,f,g)},b=function(a,b){var d=b.bounds,e=Math.floor(d.min.x/a.bucketWidth),f=Math.floor(d.max.x/a.bucketWidth),g=Math.floor(d.min.y/a.bucketHeight),h=Math.floor(d.max.y/a.bucketHeight);return c(e,f,g,h)},c=function(a,b,c,d){return{id:a+","+b+","+c+","+d,startCol:a,endCol:b,startRow:c,endRow:d}},d=function(a,b){return a+","+b},e=function(a,b){var c=a[b]=[];return c},f=function(a,b,c){for(var d=0;d<b.length;d++){var e=b[d];if(!(c.id===e.id||c.isStatic&&e.isStatic)){var f=i(c,e);a.pairs[f]?a.pairs[f][2]+=1:a.pairs[f]=[c,e,1]}}b.push(c)},h=function(a,b,c){for(var d=0;d<b.length;d++){var e=b[d];if(e.id!==c.id){var f=i(c,e);if(a.pairs[f]){var g=a.pairs[f][2];a.pairs[f][2]=g>0?g-1:0}}else b.splice(d,1)}},i=function(a,b){return a.id<b.id?a.id+","+b.id:b.id+","+a.id},j=function(a){var b,c,d=[];b=n.keys(a.pairs);for(var e=0;e<b.length;e++)c=a.pairs[b[e]],c[2]>0&&d.push(c);return d}}();var h={};!function(){var a=500;h.updatePairs=function(a,b,c,d,e){var f;for(f=0;f<b.length;f++){var g=b[f];i.setActive(g,!1)}var h=!1,j=e(c,d);for(f=0;f<j.length;f++){var k=j[f],l=i.id(k.bodyA,k.bodyB);l in a?i.update(a[l],k):(a[l]=i.create(k),h=!0)}return h},h.removeOldPairs=function(b,c){var d,e=n.now(),f=!1;for(d=0;d<c.length;d++){var g=c[d],h=g.collision;h.bodyA.isSleeping||h.bodyB.isSleeping?g.timestamp=e:e-g.timestamp>a&&(delete b[g.id],f=!0)}return f}}();var i={};!function(){i.create=function(a){var b=a.bodyA,c=a.bodyB,d={id:i.id(b,c),contacts:{},activeContacts:[],separation:0,isActive:!0,timestamp:n.now(),inverseMass:b.inverseMass+c.inverseMass,friction:Math.min(b.friction,c.friction),restitution:Math.max(b.restitution,c.restitution),slop:Math.max(b.slop,c.slop)};return i.update(d,a),d},i.update=function(a,b){var c=a.contacts,d=b.supports,f=[];if(a.collision=b,b.collided){for(var g=0;g<d.length;g++){var h=d[g],j=e.id(h);f.push(j in c?c[j]:c[j]=e.create(h))}a.activeContacts=f,a.separation=b.depth,i.setActive(a,!0)}else i.setActive(a,!1)},i.setActive=function(a,b){b?(a.isActive=!0,a.timestamp=n.now()):(a.isActive=!1,a.activeContacts=[])},i.id=function(a,b){return a.id<b.id?a.id+"_"+b.id:b.id+"_"+a.id}}();var j={};!function(){var a=4,b=.2,c=.6;j.solvePosition=function(a){var c,d,e,f,g,h,i,j,k;for(c=0;c<a.length;c++)d=a[c],d.isActive&&(e=d.collision,f=e.bodyA,g=e.bodyB,h=e.supports[0],i=e.supportCorrected,j=e.normal,k=w.sub(w.add(g.positionImpulse,h),w.add(f.positionImpulse,i)),d.separation=w.dot(j,k));for(c=0;c<a.length;c++)d=a[c],d.isActive&&(e=d.collision,f=e.bodyA,g=e.bodyB,j=e.normal,positionImpulse=d.separation*b-d.slop,(f.isStatic||g.isStatic)&&(positionImpulse*=2),f.isStatic||f.isSleeping||(f.positionImpulse.x+=j.x*positionImpulse,f.positionImpulse.y+=j.y*positionImpulse),g.isStatic||g.isSleeping||(g.positionImpulse.x-=j.x*positionImpulse,g.positionImpulse.y-=j.y*positionImpulse))},j.postSolvePosition=function(a){for(var b=0;b<a.length;b++){var d=a[b];(0!==d.positionImpulse.x||0!==d.positionImpulse.y)&&(d.position.x+=d.positionImpulse.x,d.position.y+=d.positionImpulse.y,d.positionPrev.x+=d.positionImpulse.x,d.positionPrev.y+=d.positionImpulse.y,x.translate(d.vertices,d.positionImpulse),v.update(d.bounds,d.vertices,d.velocity),d.positionImpulse.x*=c,d.positionImpulse.y*=c)}},j.preSolveVelocity=function(a){var b,c,d,e,f,g,h,i,j,k,l,m,n,o,p={};for(b=0;b<a.length;b++)if(d=a[b],d.isActive)for(e=d.activeContacts,f=d.collision,g=f.bodyA,h=f.bodyB,i=f.normal,j=f.tangent,c=0;c<e.length;c++)k=e[c],l=k.vertex,m=k.normalImpulse,n=k.tangentImpulse,p.x=i.x*m+j.x*n,p.y=i.y*m+j.y*n,g.isStatic||g.isSleeping||(o=w.sub(l,g.position),g.positionPrev.x+=p.x*g.inverseMass,g.positionPrev.y+=p.y*g.inverseMass,g.anglePrev+=w.cross(o,p)*g.inverseInertia),h.isStatic||h.isSleeping||(o=w.sub(l,h.position),h.positionPrev.x-=p.x*h.inverseMass,h.positionPrev.y-=p.y*h.inverseMass,h.anglePrev-=w.cross(o,p)*h.inverseInertia)},j.solveVelocity=function(b){for(var c={},d=0;d<b.length;d++){var e=b[d];if(e.isActive){var f=e.collision,g=f.bodyA,h=f.bodyB,i=f.normal,j=f.tangent,k=e.activeContacts,l=1/k.length;g.velocity.x=g.position.x-g.positionPrev.x,g.velocity.y=g.position.y-g.positionPrev.y,h.velocity.x=h.position.x-h.positionPrev.x,h.velocity.y=h.position.y-h.positionPrev.y,g.angularVelocity=g.angle-g.anglePrev,h.angularVelocity=h.angle-h.anglePrev;for(var m=0;m<k.length;m++){var o=k[m],p=o.vertex,q=w.sub(p,g.position),r=w.sub(p,h.position),s=w.add(g.velocity,w.mult(w.perp(q),g.angularVelocity)),t=w.add(h.velocity,w.mult(w.perp(r),h.angularVelocity)),u=w.sub(s,t),v=w.dot(i,u),x=w.dot(j,u),y=Math.abs(x),z=n.sign(x),A=(1+e.restitution)*v,B=n.clamp(e.separation+v,0,1),C=x;y>B*e.friction&&(C=B*e.friction*z);var D=w.cross(q,i),E=w.cross(r,i),F=l/(e.inverseMass+g.inverseInertia*D*D+h.inverseInertia*E*E);if(A*=F,C*=F,0>v&&v*v>a)o.normalImpulse=0,o.tangentImpulse=0;else{var G=o.normalImpulse;o.normalImpulse=Math.min(o.normalImpulse+A,0),A=o.normalImpulse-G;var H=o.tangentImpulse;o.tangentImpulse=n.clamp(o.tangentImpulse+C,-y,y),C=o.tangentImpulse-H}c.x=i.x*A+j.x*C,c.y=i.y*A+j.y*C,g.isStatic||g.isSleeping||(g.positionPrev.x+=c.x*g.inverseMass,g.positionPrev.y+=c.y*g.inverseMass,g.anglePrev+=w.cross(q,c)*g.inverseInertia),h.isStatic||h.isSleeping||(h.positionPrev.x-=c.x*h.inverseMass,h.positionPrev.y-=c.y*h.inverseMass,h.anglePrev-=w.cross(r,c)*h.inverseInertia)}}}}}();var k={};!function(){k.collides=function(b,d){var e,f,g,h={collided:!1,bodyA:b,bodyB:d};if(e=a(b.vertices,d.vertices,b.axes),0===e.overlap)return h;if(f=a(d.vertices,b.vertices,d.axes),0===f.overlap)return h;e.overlap<f.overlap?g=e:(g=f,h.bodyA=d,h.bodyB=b),h.collided=!0,h.normal=g.axis,h.depth=g.overlap,b=h.bodyA,d=h.bodyB,w.dot(h.normal,w.sub(d.position,b.position))>0&&(h.normal=w.neg(h.normal)),h.tangent=w.perp(h.normal),h.penetration={x:h.normal.x*h.depth,y:h.normal.y*h.depth};var i=c(b,d,h.normal),j=[i[0]];if(x.contains(b.vertices,i[1]))j.push(i[1]);else{var k=c(d,b,w.neg(h.normal));x.contains(d.vertices,k[0])&&j.push(k[0]),j.length<2&&x.contains(d.vertices,k[1])&&j.push(k[1])}return h.supports=j,h.supportCorrected=w.sub(i[0],h.penetration),h};var a=function(a,c,d){for(var e,f,g={},h={},i={overlap:Number.MAX_VALUE},j=0;j<d.length;j++){if(f=d[j],b(g,a,f),b(h,c,f),e=g.min<h.min?g.max-h.min:h.max-g.min,0>=e)return{overlap:0};e<i.overlap&&(i.overlap=e,i.axis=f)}return i},b=function(a,b,c){for(var d=w.dot(b[0],c),e=d,f=1;f<b.length;f+=1){var g=w.dot(b[f],c);g>e?e=g:d>g&&(d=g)}a.min=d,a.max=e},c=function(a,b,c){for(var d,e,f=Number.MAX_VALUE,g={x:0,y:0},h=b.vertices,i=a.position,j=h[0],k=h[1],l=0;l<h.length;l++)e=h[l],g.x=e.x-i.x,g.y=e.y-i.y,d=-w.dot(c,g),f>d&&(f=d,j=e);var m=j.index-1>=0?j.index-1:h.length-1;e=h[m],g.x=e.x-i.x,g.y=e.y-i.y,f=-w.dot(c,g),k=e;var n=(j.index+1)%h.length;return e=h[n],g.x=e.x-i.x,g.y=e.y-i.y,d=-w.dot(c,g),f>d&&(f=d,k=e),[j,k]}}();var l={};!function(){var a=1e-6;l.create=function(b){var c=b;c.bodyA&&!c.pointA&&(c.pointA={x:0,y:0}),c.bodyB&&!c.pointB&&(c.pointB={x:0,y:0});var d=c.bodyA?w.add(c.bodyA.position,c.pointA):c.pointA,e=c.bodyB?w.add(c.bodyB.position,c.pointB):c.pointB,f=w.magnitude(w.sub(d,e));return c.length=c.length||f||a,c.lineWidth=c.lineWidth||2,c.strokeStyle=c.strokeStyle||"#666",c.stiffness=c.stiffness||1,c.angularStiffness=c.angularStiffness||0,c.angleA=c.bodyA?c.bodyA.angle:c.angleA,c.angleB=c.bodyB?c.bodyB.angle:c.angleB,c},l.updateAll=function(a){for(var b=0;b<a.length;b++)l.update(a[b])},l.update=function(b){var c=b.bodyA,d=b.bodyB,e=b.pointA,f=b.pointB;c&&!c.isStatic&&(b.pointA=w.rotate(e,c.angle-b.angleA),b.angleA=c.angle),d&&!d.isStatic&&(b.pointB=w.rotate(f,d.angle-b.angleB),b.angleB=d.angle);var g=e,h=f;if(c&&(g=w.add(c.position,e)),d&&(h=w.add(d.position,f)),g&&h){var i=w.sub(g,h),j=w.magnitude(i);0===j&&(j=a);var k,l,m,o,p,q,s,t,y=(j-b.length)/j,z=w.div(i,j),A=w.mult(i,.5*y*b.stiffness);c&&!c.isStatic?(m={x:g.x-c.position.x+A.x,y:g.y-c.position.y+A.y},c.velocity.x=c.position.x-c.positionPrev.x,c.velocity.y=c.position.y-c.positionPrev.y,c.angularVelocity=c.angle-c.anglePrev,k=w.add(c.velocity,w.mult(w.perp(m),c.angularVelocity)),p=w.dot(m,z),s=c.inverseMass+c.inverseInertia*p*p):(k={x:0,y:0},s=c?c.inverseMass:0),d&&!d.isStatic?(o={x:h.x-d.position.x-A.x,y:h.y-d.position.y-A.y},d.velocity.x=d.position.x-d.positionPrev.x,d.velocity.y=d.position.y-d.positionPrev.y,d.angularVelocity=d.angle-d.anglePrev,l=w.add(d.velocity,w.mult(w.perp(o),d.angularVelocity)),q=w.dot(o,z),t=d.inverseMass+d.inverseInertia*q*q):(l={x:0,y:0},t=d?d.inverseMass:0);var B=w.sub(l,k),C=w.dot(z,B)/(s+t);C>0&&(C=0);var D,E={x:z.x*C,y:z.y*C};c&&!c.isStatic&&(D=w.cross(m,E)*c.inverseInertia*(1-b.angularStiffness),r.set(c,!1),D=n.clamp(D,-.01,.01),c.position.x-=A.x,c.position.y-=A.y,c.angle+=D,x.translate(c.vertices,A,-1),x.rotate(c.vertices,D,c.position),u.rotate(c.axes,D),v.update(c.bounds,c.vertices,c.velocity)),d&&!d.isStatic&&(D=w.cross(o,E)*d.inverseInertia*(1-b.angularStiffness),r.set(d,!1),D=n.clamp(D,-.01,.01),d.position.x+=A.x,d.position.y+=A.y,d.angle-=D,x.translate(d.vertices,A),x.rotate(d.vertices,-D,d.position),u.rotate(d.axes,-D),v.update(d.bounds,d.vertices,d.velocity))}}}();var m={};!function(){m.create=function(a){var b=l.create({pointA:a.position,pointB:{x:0,y:0},length:.01,stiffness:.1,angularStiffness:1,strokeStyle:"lightgreen",lineWidth:3});return{mouse:a,dragBody:null,dragPoint:null,constraints:[b]}},m.update=function(a,b){var c=a.mouse,d=a.constraints[0];if(0===c.button||2===c.button){if(!d.bodyB)for(var e=0;e<b.length;e++){var f=b[e];v.contains(f.bounds,c.position)&&x.contains(f.vertices,c.position)&&(d.pointA=c.position,d.bodyB=f,d.pointB={x:c.position.x-f.position.x,y:c.position.y-f.position.y},d.angleB=f.angle,r.set(f,!1))}}else d.bodyB=null,d.pointB=null;d.bodyB&&(r.set(d.bodyB,!1),d.pointA=c.position)}}();var n={};!function(){n.extend=function(a){for(var b=Array.prototype.slice.call(arguments,1),c=0;c<b.length;c++){var d=b[c];if(d)for(var e in d)d[e].constructor===Object?a[e]&&a[e].constructor!==Object?a[e]=d[e]:(a[e]=a[e]||{},n.extend(a[e],d[e])):a[e]=d[e]}return a},n.keys=function(a){if(Object.keys)return Object.keys(a);var b=[];for(var c in a)b.push(c);return b},n.values=function(a){var b=[];if(Object.keys){for(var c=Object.keys(a),d=0;d<c.length;d++)b.push(a[c[d]]);return b}for(var e in a)b.push(a[e]);return b},n.shadeColor=function(a,b){var c=parseInt(a.slice(1),16),d=Math.round(2.55*b),e=(c>>16)+d,f=(c>>8&255)+d,g=(255&c)+d;return"#"+(16777216+65536*(255>e?1>e?0:e:255)+256*(255>f?1>f?0:f:255)+(255>g?1>g?0:g:255)).toString(16).slice(1)},n.shuffle=function(a){for(var b=a.length-1;b>0;b--){var c=Math.floor(Math.random()*(b+1)),d=a[b];a[b]=a[c],a[c]=d}return a},n.choose=function(a){return a[Math.floor(Math.random()*a.length)]},n.isElement=function(a){try{return a instanceof HTMLElement}catch(b){return"object"==typeof a&&1===a.nodeType&&"object"==typeof a.style&&"object"==typeof a.ownerDocument}},n.clamp=function(a,b,c){return b>a?b:a>c?c:a},n.sign=function(a){return 0>a?-1:1},n.now=Date.now||function(){return+new Date},n.random=function(a,b){return a+Math.random()*(b-a)}}();var o={};!function(){var a=60,c=8,e=1e3/a,i=window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||window.msRequestAnimationFrame||function(a){window.setTimeout(function(){a(n.now())},e)};o.create=function(b,c){var h={enabled:!0,positionIterations:6,velocityIterations:4,constraintIterations:1,pairs:{},pairsList:[],enableSleeping:!1,timeScale:1,input:{},timing:{fps:a,timestamp:0,delta:e,correction:1,deltaMin:1e3/a,deltaMax:1e3/(.5*a)}},i=n.extend(h,c);return i=n.isElement(b)?i||{}:b,(!i.render||i.render&&!i.render.controller)&&(i.render=z.create(i.render),n.isElement(b)&&b.appendChild(i.render.canvas)),i.world=d.create(i.world),i.metrics=i.metrics||p.create(),i.input.mouse=i.input.mouse||q.create(i.render.canvas),i.mouseConstraint=i.mouseConstraint||m.create(i.input.mouse),d.addComposite(i.world,i.mouseConstraint),i.broadphase=i.broadphase||{current:"grid",grid:{controller:g,instance:g.create(),detector:f.collisions},bruteForce:{detector:f.bruteForce}},i.events={tick:function(a){o.update(a,a.timing.delta,a.timing.correction)},render:function(a){a.render.options.enabled&&a.render.controller.world(a)}},i},o.run=function(a){var b,d=a.timing,f=0,g=0,h=[];!function j(k){i(j),a.enabled&&(b=k-d.timestamp||e,h.push(b),h=h.slice(-c),b=Math.min.apply(null,h),b=b<a.timing.deltaMin?a.timing.deltaMin:b,b=b>a.timing.deltaMax?a.timing.deltaMax:b,d.timestamp=k,d.correction=b/d.delta,d.delta=b,g+=1,k-f>=1e3&&(d.fps=g*((k-f)/1e3),f=k,g=0),a.events.tick(a),a.events.render(a))}()},o.update=function(a,c,d){var e,f=a.world,g=a.broadphase[a.broadphase.current],i=[];for(b.resetForcesAll(f.bodies,f.gravity),p.reset(a.metrics),m.update(a.mouseConstraint,f.bodies,a.input),b.updateAll(f.bodies,c*a.timeScale,d,f.bounds),e=0;e<a.constraintIterations;e++)l.updateAll(f.constraints);g.controller?(g.controller.update(g.instance,f.bodies,a),i=g.instance.pairsList):i=f.bodies;var k=h.updatePairs(a.pairs,a.pairsList,i,a.metrics,g.detector),o=h.removeOldPairs(a.pairs,a.pairsList);for((k||o)&&(a.pairsList=n.values(a.pairs)),a.enableSleeping&&r.afterCollisions(a.pairsList),j.preSolveVelocity(a.pairsList),e=0;e<a.velocityIterations;e++)j.solveVelocity(a.pairsList);for(e=0;e<a.positionIterations;e++)j.solvePosition(a.pairsList);return j.postSolvePosition(f.bodies),a.enableSleeping&&r.update(f.bodies),p.update(a.metrics,a),a},o.merge=function(a,c){if(n.extend(a,c),c.world){a.world=c.world,o.clear(a);for(var d=a.world.bodies,e=0;e<d.length;e++){var f=d[e];r.set(f,!1),f.id=b.nextId()}var h=a.broadphase[a.broadphase.current];if(h.controller===g){var i=h.instance;g.clear(i),g.update(i,a.world.bodies,a,!0)}}},o.clear=function(a){var b=a.world;a.pairs={},a.pairsList=[],d.addComposite(a.world,a.mouseConstraint);var c=a.broadphase[a.broadphase.current];c.controller===g&&g.clear(c.instance),c.controller&&c.controller.update(c.instance,b.bodies,a,!0)}}();var p={};!function(){p.create=function(){return{narrowDetections:0,narrowphaseTests:0,midphaseTests:0,broadphaseTests:0,narrowEff:1e-4,midEff:1e-4,broadEff:1e-4,collisions:0,buckets:0,bodies:0,pairs:0}},p.reset=function(a){a.narrowDetections=0,a.narrowphaseTests=0,a.midphaseTests=0,a.broadphaseTests=0,a.narrowEff=0,a.midEff=0,a.broadEff=0,a.collisions=0,a.buckets=0,a.pairs=0,a.bodies=0},p.update=function(a,b){var c=b.world,d=b.broadphase[b.broadphase.current];a.collisions=a.narrowDetections,a.pairs=b.pairsList.length,a.bodies=c.bodies.length,a.midEff=(a.narrowDetections/(a.midphaseTests||1)).toFixed(2),a.narrowEff=(a.narrowDetections/(a.narrowphaseTests||1)).toFixed(2),a.broadEff=(1-a.broadphaseTests/(c.bodies.length||1)).toFixed(2),d.instance&&(a.buckets=n.keys(d.instance.buckets).length)}}();var q;!function(){q=function(b){var c=this;b=b||document.body,this.position={x:0,y:0},this.mousedownPosition={x:0,y:0},this.mouseupPosition={x:0,y:0},this.button=-1;var d=function(d){var e=a(d,b),f=d.changedTouches;f&&(c.button=0,d.preventDefault()),c.position=e},e=function(d){var e=a(d,b),f=d.changedTouches;f?(c.button=0,d.preventDefault()):c.button=d.button,c.position=c.mousedownPosition=e},f=function(d){var e=a(d,b),f=d.changedTouches;f&&d.preventDefault(),c.button=-1,c.position=c.mouseupPosition=e};b.addEventListener("mousemove",d),b.addEventListener("mousedown",e),b.addEventListener("mouseup",f),b.addEventListener("touchmove",d),b.addEventListener("touchstart",e),b.addEventListener("touchend",f)},q.create=function(a){return new q(a)};var a=function(a,b){var c,d,e=b.getBoundingClientRect(),f=void 0!==window.pageXOffset?window.pageXOffset:(document.documentElement||document.body.parentNode||document.body).scrollLeft,g=void 0!==window.pageYOffset?window.pageYOffset:(document.documentElement||document.body.parentNode||document.body).scrollTop,h=a.changedTouches;return h?(c=h[0].pageX-e.left-f,d=h[0].pageY-e.top-g):(c=a.pageX-e.left-f,d=a.pageY-e.top-g),{x:c/(b.clientWidth/b.width),y:d/(b.clientHeight/b.height)}}}();var r={};!function(){var a=.18,b=.08,c=.9;r.update=function(a){for(var d=0;d<a.length;d++){var e=a[d],f=e.speed*e.speed+e.angularSpeed*e.angularSpeed,g=Math.min(e.motion,f),h=Math.max(e.motion,f);e.motion=c*g+(1-c)*h,e.sleepThreshold>0&&e.motion<b?(e.sleepCounter+=1,e.sleepCounter>=e.sleepThreshold&&r.set(e,!0)):e.sleepCounter>0&&(e.sleepCounter-=1)}},r.afterCollisions=function(b){for(var c=0;c<b.length;c++){var d=b[c],e=d.collision,f=e.bodyA,g=e.bodyB;if(!(f.isSleeping&&g.isSleeping||f.isStatic||g.isStatic)&&(f.isSleeping||g.isSleeping)){var h=f.isSleeping&&!f.isStatic?f:g,i=h===f?g:f;!h.isStatic&&i.motion>a&&r.set(h,!1)}}},r.set=function(a,b){b?(a.isSleeping=!0,a.sleepCounter=a.sleepThreshold,a.positionImpulse.x=0,a.positionImpulse.y=0,a.positionPrev.x=a.position.x,a.positionPrev.y=a.position.y,a.anglePrev=a.angle,a.speed=0,a.angularSpeed=0,a.motion=0):(a.isSleeping=!1,a.sleepCounter=0)}}();var s={};!function(){s.rectangle=function(a,c,d,e,f){f=f||{};var g={position:{x:a,y:c},path:"L 0 0 L "+d+" 0 L "+d+" "+e+" L 0 "+e};return b.create(n.extend({},g,f))},s.trapezoid=function(a,c,d,e,f,g){g=g||{},f*=.5;var h=(1-2*f)*d,i=d*f,j=i+h,k=j+i,l={position:{x:a,y:c},path:"L 0 0 L "+i+" "+-e+" L "+j+" "+-e+" L "+k+" 0"};return b.create(n.extend({},l,g))},s.circle=function(a,b,c,d,e){d=d||{},e=e||25;var f=Math.ceil(Math.max(10,Math.min(e,c)));return f%2===1&&(f+=1),d.circleRadius=c,s.polygon(a,b,f,c,d)},s.polygon=function(a,c,d,e,f){if(f=f||{},3>d)return s.circle(a,c,e,f);for(var g=2*Math.PI/d,h="",i=.5*g,j=0;d>j;j+=1){var k=i+j*g,l=Math.cos(k)*e,m=Math.sin(k)*e;h+="L "+l.toFixed(3)+" "+m.toFixed(3)+" "}var o={position:{x:a,y:c},path:h};return b.create(n.extend({},o,f))}}();var t={};!function(){t.stack=function(a,d,e,f,g,h,i){for(var j,k=c.create(),l=a,m=d,n=0,o=0;f>o;o++){for(var p=0,q=0;e>q;q++){var r=i(l,m,q,o,j,n);if(r){var s=r.bounds.max.y-r.bounds.min.y,t=r.bounds.max.x-r.bounds.min.x;s>p&&(p=s),b.translate(r,{x:.5*t,y:.5*s}),l=r.bounds.max.x+g,c.addBody(k,r),j=r,n+=1}}m+=p+h,l=a}return k},t.chain=function(a,b,d,e,f,g){for(var h=a.bodies,i=1;i<h.length;i++){var j=h[i-1],k=h[i],m=j.bounds.max.y-j.bounds.min.y,o=j.bounds.max.x-j.bounds.min.x,p=k.bounds.max.y-k.bounds.min.y,q=k.bounds.max.x-k.bounds.min.x,r={bodyA:j,pointA:{x:o*b,y:m*d},bodyB:k,pointB:{x:q*e,y:p*f}},s=n.extend(r,g);c.addConstraint(a,l.create(s))}return a},t.pyramid=function(a,c,d,e,f,g,h){return t.stack(a,c,d,e,f,g,function(c,g,i,j,k,l){var m=Math.min(e,Math.ceil(d/2)),n=k?k.bounds.max.x-k.bounds.min.x:0;if(!(j>m)){j=m-j;var o=j,p=d-1-j;if(!(o>i||i>p)){1===l&&b.translate(k,{x:(i+(d%2===1?1:-1))*n,y:0});var q=k?i*n:0;return h(a+q+i*f,g,i,j,k,l)}}})},t.newtonsCradle=function(a,b,d,e,f){for(var g=c.create(),h=0;d>h;h++){var i=1.9,j=s.circle(a+h*e*i,b+f,e,{restitution:1,friction:0,frictionAir:1e-4,slop:.01}),k=l.create({pointA:{x:a+h*e*i,y:b},bodyB:j});c.addBody(g,j),c.addConstraint(g,k)}return g},t.car=function(a,d,e,f,g){var h=b.nextGroupId(),i=-20,j=.5*-e+i,k=.5*e-i,m=0,n=c.create(),o=s.trapezoid(a,d,e,f,.3,{groupId:h,friction:.01}),p=s.circle(a+j,d+m,g,{groupId:h,restitution:.5,friction:.9,density:.01}),q=s.circle(a+k,d+m,g,{groupId:h,restitution:.5,friction:.9,density:.01}),r=l.create({bodyA:o,pointA:{x:j,y:m},bodyB:p,stiffness:.5}),t=l.create({bodyA:o,pointA:{x:k,y:m},bodyB:q,stiffness:.5});return c.addBody(n,o),c.addBody(n,p),c.addBody(n,q),c.addConstraint(n,r),c.addConstraint(n,t),n}}();var u={};!function(){u.fromVertices=function(a){for(var b={},c=0;c<a.length;c++){var d=(c+1)%a.length,e=w.normalise({x:a[d].y-a[c].y,y:a[c].x-a[d].x}),f=0===e.y?1/0:e.x/e.y;f=f.toFixed(3).toString(),b[f]=e}return n.values(b)},u.rotate=function(a,b){if(0!==b)for(var c=Math.cos(b),d=Math.sin(b),e=0;e<a.length;e++){var f,g=a[e];f=g.x*c-g.y*d,g.y=g.x*d+g.y*c,g.x=f}}}();var v={};!function(){v.create=function(a){var b={min:{x:0,y:0},max:{x:0,y:0}};return v.update(b,a),b},v.update=function(a,b,c){a.min.x=Number.MAX_VALUE,a.max.x=Number.MIN_VALUE,a.min.y=Number.MAX_VALUE,a.max.y=Number.MIN_VALUE;for(var d=0;d<b.length;d++){var e=b[d];e.x>a.max.x&&(a.max.x=e.x),e.x<a.min.x&&(a.min.x=e.x),e.y>a.max.y&&(a.max.y=e.y),e.y<a.min.y&&(a.min.y=e.y)}c&&(c.x>0?a.max.x+=c.x:a.min.x+=c.x,c.y>0?a.max.y+=c.y:a.min.y+=c.y)},v.contains=function(a,b){return b.x>=a.min.x&&b.x<=a.max.x&&b.y>=a.min.y&&b.y<=a.max.y},v.overlaps=function(a,b){return a.min.x<=b.max.x&&a.max.x>=b.min.x&&a.max.y>=b.min.y&&a.min.y<=b.max.y}}();var w={};!function(){w.magnitude=function(a){return Math.sqrt(a.x*a.x+a.y*a.y)},w.magnitudeSquared=function(a){return a.x*a.x+a.y*a.y},w.rotate=function(a,b){var c=Math.cos(b),d=Math.sin(b);return{x:a.x*c-a.y*d,y:a.x*d+a.y*c}},w.rotateAbout=function(a,b,c){var d=Math.cos(b),e=Math.sin(b);return{x:c.x+((a.x-c.x)*d-(a.y-c.y)*e),y:c.y+((a.x-c.x)*e+(a.y-c.y)*d)}},w.normalise=function(a){var b=w.magnitude(a);return 0===b?{x:0,y:0}:{x:a.x/b,y:a.y/b}},w.dot=function(a,b){return a.x*b.x+a.y*b.y},w.cross=function(a,b){return a.x*b.y-a.y*b.x},w.add=function(a,b){return{x:a.x+b.x,y:a.y+b.y}},w.sub=function(a,b){return{x:a.x-b.x,y:a.y-b.y}},w.mult=function(a,b){return{x:a.x*b,y:a.y*b}},w.div=function(a,b){return{x:a.x/b,y:a.y/b}},w.perp=function(a,b){return b=b===!0?-1:1,{x:b*-a.y,y:b*a.x}},w.neg=function(a){return{x:-a.x,y:-a.y}}}();var x={};!function(){x.create=function(a,b){for(var c=0;c<a.length;c++)a[c].index=c,a[c].body=b},x.fromPath=function(a){var b=/L\s*([\-\d\.]*)\s*([\-\d\.]*)/gi,c=[];return a.replace(b,function(a,b,d){c.push({x:parseFloat(b,10),y:parseFloat(d,10)})}),c},x.centre=function(a){for(var b=0,c=0,d=0;d<a.length;d++)b+=a[d].x,c+=a[d].y;return{x:b/a.length,y:c/a.length}},x.area=function(a){for(var b=0,c=a.length-1,d=0;d<a.length;d++)b+=(a[c].x-a[d].x)*(a[c].y+a[d].y),c=d;return Math.abs(b)/2},x.inertia=function(a,b){for(var c,d,e=0,f=0,g=a,h=0;h<g.length;h++)d=(h+1)%g.length,c=Math.abs(w.cross(g[d],g[h])),e+=c*(w.dot(g[d],g[d])+w.dot(g[d],g[h])+w.dot(g[h],g[h])),f+=c;return b/6*(e/f)},x.translate=function(a,b,c){var d;if(c)for(d=0;d<a.length;d++)a[d].x+=b.x*c,a[d].y+=b.y*c;else for(d=0;d<a.length;d++)a[d].x+=b.x,a[d].y+=b.y},x.rotate=function(a,b,c){if(0!==b)for(var d=Math.cos(b),e=Math.sin(b),f=0;f<a.length;f++){var g=a[f],h=g.x-c.x,i=g.y-c.y;g.x=c.x+(h*d-i*e),g.y=c.y+(h*e+i*d)}},x.contains=function(a,b){for(var c=0;c<a.length;c++){var d=a[c],e=a[(c+1)%a.length];if((b.x-d.x)*(e.y-d.y)+(b.y-d.y)*(d.x-e.x)>0)return!1}return!0}}();var y={};!function(){y.create=function(a,b){var c,e=window.dat&&window.localStorage;if(!e)return void console.log("Could not create GUI. Check dat.gui library is loaded first.");var f=new dat.GUI(b);Resurrect?(c=new Resurrect({prefix:"$"}),c.parse=c.resurrect):c=JSON;var g={datGui:f,amount:1,size:40,sides:4,density:.001,restitution:0,friction:.1,frictionAir:.01},h={addBody:function(){for(var b={density:g.density,friction:g.friction,frictionAir:g.frictionAir,restitution:g.restitution},c=0;c<g.amount;c++)d.addBody(a.world,s.polygon(120+c*g.size+50*c,200,g.sides,g.size,b))},clear:function(){d.clear(a.world,!0),o.clear(a)},save:function(){localStorage&&c&&localStorage.setItem("world",c.stringify(a.world))},load:function(){var b;localStorage&&c&&(b=c.parse(localStorage.getItem("world"))),b&&o.merge(a,{world:b})}},i=f.addFolder("Metrics");i.add(a.timing,"fps").listen(),i.add(a.timing,"delta").listen(),i.add(a.timing,"correction").listen(),i.add(a.metrics,"bodies").listen(),i.add(a.metrics,"collisions").listen(),i.add(a.metrics,"pairs").listen(),i.add(a.metrics,"broadEff").listen(),i.add(a.metrics,"midEff").listen(),i.add(a.metrics,"narrowEff").listen(),i.close();var j=f.addFolder("Add Body");j.add(g,"amount",1,5).step(1),j.add(g,"size",5,150).step(1),j.add(g,"sides",1,8).step(1),j.add(g,"density",1e-4,.01).step(.001),j.add(g,"friction",0,1).step(.05),j.add(g,"frictionAir",0,10*g.frictionAir).step(g.frictionAir/10),j.add(g,"restitution",0,1).step(.1),j.add(h,"addBody"),j.open();var k=f.addFolder("World");k.add(h,"load"),k.add(h,"save"),k.add(h,"clear"),k.open();var l=k.addFolder("Gravity");l.add(a.world.gravity,"x",-1,1).step(.01),l.add(a.world.gravity,"y",-1,1).step(.01),l.open();var m=f.addFolder("Engine");m.add(a,"enableSleeping"),m.add(a.broadphase,"current",["grid","bruteForce"]),m.add(a,"timeScale",.1,2).step(.1),m.add(a,"velocityIterations",1,10).step(1),m.add(a,"positionIterations",1,10).step(1),m.add(a,"enabled"),m.open();var n=f.addFolder("Render");return n.add(a.render.options,"wireframes"),n.add(a.render.options,"showDebug"),n.add(a.render.options,"showPositions"),n.add(a.render.options,"showBroadphase"),n.add(a.render.options,"showBounds"),n.add(a.render.options,"showVelocity"),n.add(a.render.options,"showCollisions"),n.add(a.render.options,"showAxes"),n.add(a.render.options,"showAngleIndicator"),n.add(a.render.options,"showSleeping"),n.add(a.render.options,"showIds"),n.add(a.render.options,"showShadows"),n.add(a.render.options,"enabled"),n.open(),g},y.update=function(a,b){var c;b=b||a.datGui;for(c in b.__folders)y.update(a,b.__folders[c]);for(c in b.__controllers){var d=b.__controllers[c];d.updateDisplay&&d.updateDisplay()}},y.closeAll=function(a){var b=a.datGui;for(var c in b.__folders)b.__folders[c].close()}}();var z={};!function(){z.create=function(b){var c={controller:z,options:{width:800,height:600,background:"#fafafa",wireframeBackground:"#222",enabled:!0,wireframes:!0,showSleeping:!0,showDebug:!1,showBroadphase:!1,showBounds:!1,showVelocity:!1,showCollisions:!1,showAxes:!1,showPositions:!1,showAngleIndicator:!1,showIds:!1,showShadows:!1}},d=n.extend(c,b);return d.canvas=d.canvas||a(d.options.width,d.options.height),d.context=d.canvas.getContext("2d"),d},z.world=function(a){var b,c=a.render,d=a.world,e=c.canvas,f=c.context,g=c.options;if(f.fillStyle=g.wireframes?g.wireframeBackground:g.background,f.fillRect(0,0,e.width,e.height),g.showShadows&&!g.wireframes)for(b=0;b<d.bodies.length;b++)z.bodyShadow(a,d.bodies[b],f);for(b=0;b<d.bodies.length;b++)z.body(a,d.bodies[b],f);for(b=0;b<d.constraints.length;b++)z.constraint(d.constraints[b],f);if(g.showCollisions)for(b=0;b<a.pairsList.length;b++)z.collision(a,a.pairsList[b],f);g.showBroadphase&&"grid"===a.broadphase.current&&z.grid(a,a.broadphase[a.broadphase.current].instance,f),g.showDebug&&z.debug(a,f)},z.debug=function(a,b){var c=b,d=a.world,e=a.render,f=e.options,h="    ";if(a.timing.timestamp-(e.debugTimestamp||0)>=500){var i="";
i+="delta: "+a.timing.delta.toFixed(3)+h,i+="fps: "+Math.round(a.timing.fps)+h,i+="correction: "+a.timing.correction.toFixed(3)+h,i+="bodies: "+d.bodies.length+h,a.broadphase.controller===g&&(i+="buckets: "+a.metrics.buckets+h),i+="\n",i+="collisions: "+a.metrics.collisions+h,i+="pairs: "+a.pairs.length+h,i+="broad: "+a.metrics.broadEff+h,i+="mid: "+a.metrics.midEff+h,i+="narrow: "+a.metrics.narrowEff+h,e.debugString=i,e.debugTimestamp=a.timing.timestamp}if(e.debugString){c.font="12px Arial",c.fillStyle=f.wireframes?"rgba(255,255,255,0.5)":"rgba(0,0,0,0.5)";for(var j=e.debugString.split("\n"),k=0;k<j.length;k++)c.fillText(j[k],50,50+18*k)}},z.constraint=function(a,b){var c=a.bodyA,d=a.bodyB,e=b;a.pointA&&a.pointB&&(c?(e.beginPath(),e.moveTo(c.position.x+a.pointA.x,c.position.y+a.pointA.y)):(e.beginPath(),e.moveTo(a.pointA.x,a.pointA.y)),d?e.lineTo(d.position.x+a.pointB.x,d.position.y+a.pointB.y):e.lineTo(a.pointB.x,a.pointB.y),e.lineWidth=a.lineWidth,e.strokeStyle=a.strokeStyle,e.stroke())},z.bodyShadow=function(a,b,c){var d=c,e=a.render;if(b.circleRadius)d.beginPath(),d.arc(b.position.x,b.position.y,b.circleRadius,0,2*Math.PI),d.closePath();else{d.beginPath(),d.moveTo(b.vertices[0].x,b.vertices[0].y);for(var f=1;f<b.vertices.length;f++)d.lineTo(b.vertices[f].x,b.vertices[f].y);d.closePath()}var g=b.position.x-.5*e.options.width,h=b.position.y-.2*e.options.height,i=Math.abs(g)+Math.abs(h);d.shadowColor="rgba(0,0,0,0.15)",d.shadowOffsetX=.05*g,d.shadowOffsetY=.05*h,d.shadowBlur=1+12*Math.min(1,i/1e3),d.fill(),d.shadowColor=null,d.shadowOffsetX=null,d.shadowOffsetY=null,d.shadowBlur=null},z.body=function(a,b,c){var d=c,e=a.render,f=e.options;if(f.showBounds&&(d.beginPath(),d.rect(b.bounds.min.x,b.bounds.min.y,b.bounds.max.x-b.bounds.min.x,b.bounds.max.y-b.bounds.min.y),d.lineWidth=1,d.strokeStyle=f.wireframes?"rgba(255,255,255,0.08)":"rgba(0,0,0,0.1)",d.stroke()),b.circleRadius)d.beginPath(),d.arc(b.position.x,b.position.y,b.circleRadius,0,2*Math.PI),d.closePath();else{d.beginPath(),d.moveTo(b.vertices[0].x,b.vertices[0].y);for(var g=1;g<b.vertices.length;g++)d.lineTo(b.vertices[g].x,b.vertices[g].y);d.closePath()}if(f.wireframes?(d.lineWidth=1,d.strokeStyle="#bbb",f.showSleeping&&b.isSleeping&&(d.strokeStyle="rgba(255,255,255,0.2)"),d.stroke()):(d.fillStyle=b.fillStyle,f.showSleeping&&b.isSleeping&&(d.fillStyle=n.shadeColor(b.fillStyle,50)),d.lineWidth=b.lineWidth,d.strokeStyle=b.strokeStyle,d.fill(),d.stroke()),f.showAngleIndicator&&!f.showAxes&&(d.beginPath(),d.moveTo(b.position.x,b.position.y),d.lineTo((b.vertices[0].x+b.vertices[b.vertices.length-1].x)/2,(b.vertices[0].y+b.vertices[b.vertices.length-1].y)/2),d.lineWidth=1,d.strokeStyle=f.wireframes?"indianred":b.strokeStyle,d.stroke()),f.showAxes)for(var h=0;h<b.axes.length;h++){var i=b.axes[h];d.beginPath(),d.moveTo(b.position.x,b.position.y),d.lineTo(b.position.x+20*i.x,b.position.y+20*i.y),d.lineWidth=1,d.strokeStyle=f.wireframes?"indianred":b.strokeStyle,d.stroke()}f.showPositions&&(d.beginPath(),d.arc(b.position.x,b.position.y,3,0,2*Math.PI,!1),d.fillStyle=f.wireframes?"indianred":"rgba(0,0,0,0.5)",d.fill(),d.beginPath(),d.arc(b.positionPrev.x,b.positionPrev.y,2,0,2*Math.PI,!1),d.fillStyle="rgba(255,165,0,0.8)",d.fill()),f.showVelocity&&(d.beginPath(),d.moveTo(b.position.x,b.position.y),d.lineTo(b.position.x+2*(b.position.x-b.positionPrev.x),b.position.y+2*(b.position.y-b.positionPrev.y)),d.lineWidth=3,d.strokeStyle="cornflowerblue",d.stroke()),f.showIds&&(d.font="12px Arial",d.fillStyle="rgba(255,255,255,0.5)",d.fillText(b.id,b.position.x+10,b.position.y-10))},z.collision=function(a,b,c){for(var d=c,e=b.collision,f=a.render.options,g=0;g<b.activeContacts.length;g++){var h=b.activeContacts[g],i=h.vertex;d.beginPath(),d.rect(i.x-1.5,i.y-1.5,3.5,3.5),d.fillStyle=f.wireframes?"rgba(255,255,255,0.7)":"orange",d.fill()}if(b.activeContacts.length>0){var j=b.activeContacts[0].vertex.x,k=b.activeContacts[0].vertex.y;2===b.activeContacts.length&&(j=(b.activeContacts[0].vertex.x+b.activeContacts[1].vertex.x)/2,k=(b.activeContacts[0].vertex.y+b.activeContacts[1].vertex.y)/2),d.beginPath(),d.moveTo(j-8*e.normal.x,k-8*e.normal.y),d.lineWidth=1,d.lineTo(j,k),d.strokeStyle=f.wireframes?"rgba(255,165,0,0.7)":"orange",d.stroke()}},z.grid=function(a,b,c){var d=c,e=a.render.options;d.lineWidth=1,d.strokeStyle=e.wireframes?"rgba(255,180,0,0.1)":"rgba(255,180,0,0.5)";for(var f=n.keys(b.buckets),g=0;g<f.length;g++){var h=f[g];if(!(b.buckets[h].length<2)){var i=h.split(",");d.beginPath(),d.rect(.5+parseInt(i[0],10)*b.bucketWidth,.5+parseInt(i[1],10)*b.bucketHeight,b.bucketWidth,b.bucketHeight),d.stroke()}}};var a=function(a,b){var c=document.createElement("canvas");return c.width=a,c.height=b,c.oncontextmenu=function(){return!1},c.onselectstart=function(){return!1},c}}(),d.addComposite=c.add,d.addBody=c.addBody,d.addConstraint=c.addConstraint,a.Body=b,a.Composite=c,a.World=d,a.Contact=e,a.Detector=f,a.Grid=g,a.Manager=h,a.Pair=i,a.Resolver=j,a.SAT=k,a.Constraint=l,a.MouseConstraint=m,a.Common=n,a.Engine=o,a.Metrics=p,a.Mouse=q,a.Sleeping=r,a.Bodies=s,a.Composites=t,a.Axes=u,a.Bounds=v,a.Vector=w,a.Vertices=x,a.Gui=y,a.Render=z,"undefined"!=typeof exports&&("undefined"!=typeof module&&module.exports&&(exports=module.exports=a),exports.Matter=a),"function"==typeof define&&define.amd&&define("Matter",[],function(){return a}),"object"==typeof window&&"object"==typeof window.document&&(window.Matter=a)}(); </script>
<script> (function() {
  
  this.Cradle = {};
  
  var Engine = Matter.Engine,
      Gui = Matter.Gui,
      World = Matter.World,
      Bodies = Matter.Bodies,
      Body = Matter.Body,
      Composite = Matter.Composite,
      Composites = Matter.Composites,
      Common = Matter.Common,
      Constraint = Matter.Constraint;
  
  var _engine;
  
  Cradle.init = function() {
    var container = document.getElementById('stage');
    
    // engine options - these are the defaults
    var options = {
      positionIterations: 5,
      velocityIterations: 3,
      enableSleeping: false,
      timeScale: 1
    };
    
    _engine = Engine.create(container, options);
    Engine.run(_engine);
    
    var _world = _engine.world;
    World.clear(_world);
    Engine.clear(_engine);
    _engine.enabled = true;
    _engine.enableSleeping = false;
    _engine.world.gravity.y = 1;
    
    var renderOptions = _engine.render.options;
        renderOptions.wireframes = true;
        renderOptions.showAxes = true;
        renderOptions.showPositions = true;
    
    var cradle = Composites.newtonsCradle(240, 10, 6, 30, 200);
    World.addComposite(_world, cradle);
    Body.translate(cradle.bodies[0], { x: -180, y: -100 });
  };

  if (window.addEventListener) {
    window.addEventListener('load', Cradle.init);
  } 
  else if (window.attachEvent) {
    window.attachEvent('load', Cradle.init);
  }
  
})(); </script>

<script async>window.onload=function(){var a=document.createElement('script'),b=document.getElementsByTagName('script')[0];a.type='text/javascript',a.async=!0,a.src='/sw-register.js?v='+Date.now(),b.parentNode.insertBefore(a,b)};</script></body></html>